/**
 * 假期余额转折薪酬套件
 */
import React, { Fragment, useState, useEffect } from 'react';
import { withRouter } from 'umi';
import { Form, Input } from 'antd';
import AutoRenderComponent from '@/pages/WorkFlow/components/FormControls/components/AutoRenderComponent/AutoRenderComponent';
import request from '@/utils/request';
import { dateConversion } from '@/utils/utils';
import moment from 'moment';

const { Item } = Form;

const VocationWithdrawal = ({ dataSource, form, formValueMap }) => {
    const userInfo = JSON.parse(localStorage.getItem('user'));
    const { getFieldDecorator } = form;
    const { children: list = [] } = dataSource;
    const [config, setConfig] = useState(list);

    // 根据类型去显示对应的选项框
    const changeConfig = types => {
        const rules = [
            {
                required: true,
                message: '请输入折现天数'
            }
        ];
        const newConfig = [...config];
        const leaveTypesCode = [];
        newConfig.map(aList => {
            if (aList.formId === 'commonYear_days') {
                aList.inRenderDom = types.indexOf('CommonYear') > -1;
                aList.rules = types.indexOf('CommonYear') > -1 ? rules : [];
            }
            if (aList.formId === 'commonPaid_days') {
                aList.inRenderDom = types.indexOf('CommonPaid') > -1;
                aList.rules = types.indexOf('CommonPaid') > -1 ? rules : [];
            }
            if (aList.formId === 'leaveTypes') {
                types.map(e => {
                    aList.dataList.map(s => {
                        if (s.key === e) {
                            leaveTypesCode.push(s.label);
                        }
                        return '';
                    });
                    return '';
                });
            }
            return '';
        });
        form.setFieldsValue({
            leaveTypesCode: leaveTypesCode.join(',')
        });
        setConfig(newConfig);
    };
    // 请假类型变化
    const handleChange = types => {
        changeConfig(types);
        types.map(async item => {
            const result = await request('/api/work/v1/attendance/vocation/leavebalance', {
                method: 'POST',
                data: {
                    employeeCode: userInfo.employeeCode,
                    leaveCode: item,
                    startYear: moment().year() - 1
                }
            });
            const { code, data } = result;
            if (code === 10000) {
                const { balance } = data;
                const newConfig = [...config];
                newConfig.map(n => {
                    if (item === 'CommonYear' && n.formId === 'commonYear_days') {
                        n.extra = `去年余额为:${dateConversion(balance || 0, 8)}`;
                    }
                    if (item === 'CommonPaid' && n.formId === 'commonPaid_days') {
                        n.extra = `去年余额为:${dateConversion(balance || 0, 8)}`;
                    }
                    return '';
                });
                setConfig(newConfig);
            }
        });
    };
    useEffect(() => {
        if (formValueMap) {
            changeConfig(formValueMap.leaveTypes);
        }
    }, [formValueMap]);
    return (
        <Fragment>
            {config.length > 0 &&
                config.map(item => {
                    const { formId, label, extra, rules, options } = item;
                    const { initialValue } = item;
                    const obj = {};

                    if (formId === 'leaveTypes') {
                        obj.onChange = handleChange;
                    }

                    if (formId === 'employeeName') {
                        item.initialValue = formValueMap?.employeeName ?? userInfo.employeeName;
                        options.disabled = true;
                    }
                    if (formId === 'organizationName') {
                        item.initialValue = formValueMap?.organizationName ?? userInfo.administrativeOrganizationName;
                        options.disabled = true;
                    }

                    return (
                        <Form.Item
                            label={label}
                            key={formId}
                            extra={extra}
                            style={{ display: item?.inRenderDom === false ? 'none' : 'block' }}
                        >
                            {getFieldDecorator(formId, {
                                initialValue,
                                rules
                            })(<AutoRenderComponent form={form} config={item} {...obj} />)}
                        </Form.Item>
                    );
                })}
            <Item style={{ display: 'none' }}>
                {getFieldDecorator('employeeCode', {
                    initialValue: formValueMap?.employeeCode ?? userInfo.employeeCode
                })(<Input />)}
            </Item>
            <Item style={{ display: 'none' }}>{getFieldDecorator('duration')(<Input />)}</Item>
        </Fragment>
    );
};
export default withRouter(VocationWithdrawal);
